import Channel from "@/components/Channel"
// import { RootState } from '@/store'
// import { useSelector } from 'react-redux'
import ArticleList from './components/ArticleList'
import { useAppSelector } from '@/store'
import styles from './index.module.scss'
import ArticleMark from '@/components/ArticleMark';
export default function Home() {
  const { list, activeId } = useAppSelector((state) => state.channel)
    return (
      <div className={styles.root}>
        <Channel />
         {/* 首页新闻列表组件 */}
      {list.map((item) => (
        <div key={item.id} className='channel-list' hidden={activeId !== item.id}>
             <ArticleList channel_id={item.id} />
        </div>
      ))}
        {/* 标记文章的组件 - 不感兴趣 举报 */}
        <ArticleMark />
      </div>
    )
  }